<template>
    <div class="body">
      <ul>
        <li v-for="item in list">{{item}}</li>
      </ul>
      <p>{{ msg }}</p>
    </div>
</template>

<script setup>
import { ref } from 'vue';
const list = ref(['html', 'css'])
  
 const props = defineProps({
    msg: ''
  })

watch(
    () => props.msg,
    (newVal, oldVal) => {
        list.value.push(newVal)
    }
)
</script>

<style lang="scss" scoped>

</style>